-
Notifications
You must be signed in to change notification settings - Fork 313
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Keyboard / spatial navigation #524
Merged
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mikke89
force-pushed
the
keyboard_navigation
branch
from
October 18, 2023 17:08
9219681
to
2bd7018
Compare
Tested it on my branch in rbfx game engine. Seems to work fine. |
gleblebedev
approved these changes
Nov 3, 2023
mikke89
force-pushed
the
keyboard_navigation
branch
from
November 19, 2023 17:11
9910567
to
3ebbbd4
Compare
Co-authored-by: Michael Ragazzon <[email protected]>
Automatically enabled when focus should be visually indicated.
mikke89
force-pushed
the
keyboard_navigation
branch
from
November 19, 2023 17:39
3ebbbd4
to
4cacf38
Compare
Thanks for testing. I cleaned up the commits a bit, and made some changes so that we now can use |
Closed
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Continuation of #519, including the work of @gleblebedev (thank you!), which has been partially squashed here.
Here are the new changes in this PR:
nav
shorthand property.:focus-visible
pseudo class.invaders
sample fully work with keyboard navigation, with:focus-visible
to highlight the focus.The algorithm is designed to always pick the nearest intersecting element along a given direction. If it finds none, it will effectively try to select one that may lie outside this intersection area as well. There are different design choices here, I tried to not make something too clever on purpose, it's better that it works predictably for the 95% use case. For other cases it is easier to override it manually.
Currently the
nav
shorthand is a "box" type shorthand - that is, taking 1 to 4 values and assigns them to the direction up/right/down/left, just like for padding and margin properties. We might want to consider instead to use special keywords like horizontal, vertical, and maybe others.All feedback is very much welcome. I'll clean up the commits in the end before merging.